<template>
    <div id="app-container" style="margin: 10px 50px">
      <el-form :inline="true" :model="student" class="demo-form-inline">
        <el-form-item label="学生姓名">
          <el-select filterable v-model="FormData.studentId" placeholder="学生姓名">
            <el-option
              v-for="item in student.optionsStu"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">查询</el-button>
          <el-button type="default" @click="clear">清空</el-button>
        </el-form-item>
      </el-form>
  
      <el-table :data="logInfo" stripe style="width: 100%">
        <el-table-column prop="studentName" label="学生姓名" >
        </el-table-column>

        <el-table-column prop="authString" label="日志状态" > </el-table-column>

        <el-table-column prop="grade" label="成绩" > </el-table-column>

        <el-table-column label="操作" width="230" align="center">
          <template slot-scope="scope">
            
            <el-button  @click="gradeShow(scope.row)" type="danger" 
              >评分</el-button
            >

          </template>
        </el-table-column>
      </el-table>
  
      <div class="block">
        <el-pagination
          @current-change="handleCurrentChange"
          :current-page.sync="curPage"
          :page-size="pageSize"
          layout="total, prev, pager, next"
          :total="total"
        >
        </el-pagination>
      </div>


      <el-dialog
        title="提示"
        :visible.sync="dialogVisible"
        width="30%"
        :before-close="handleClose">
        
        <el-input
            type="text"
            placeholder="请输入成绩"
            v-model="grade"
            maxlength="10"
            show-word-limit
            >
        </el-input>


        <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="changeGreade">确 定</el-button>
        </span>
        </el-dialog>

    </div>
  </template>
  
  <script>

  import teacherApi from "@/api/teacher";
  import studentApi from "@/api/student";
  import logApi from "@/api/log";
  import gradeApi from "@/api/grade"

  
  export default { 
    data() {
      return {
        textarea: '',
        curPage: 1,
        pageSize: 3,
        total: 0,
        dialogVisible: false,
        student: {
         optionsStu:[],
        },
        FormData: {
            studentId: "",
            status: 1,
            teacherId: ""
        },
        logInfo: [],
        row: {},
        grade: ""
      };
    },
    create(){
              // 获取当前登录老师的id
      teacherApi.getByUsername().then(resp=>{
        console.log(resp.data.teacher.id);
        this.FormData.teacherId = resp.data.teacher.id;
      })
    },
    mounted() {
        this.init();
    },
    methods: {
    changeGreade(){
        gradeApi.changeGrade(this.row.id,this.grade).then(resp=>{
            this.$message.success("评分成功！");
                    // 查询所有的日志记录（当前教师下面所有学生的日志）
        gradeApi
          .pageList(this.pageSize, this.curPage, this.FormData)
          .then((resp) => {
            this.logInfo = resp.data.list;
            this.total = resp.data.total;
          });
        })
        this.dialogVisible = false;
    },
      show(row){
        this.row = row;
        console.log(row);
      },
      init() {

        // 查询所有的日志记录（当前教师下面所有学生的日志）
        gradeApi
          .pageList(this.pageSize, this.curPage, this.FormData)
          .then((resp) => {
            this.logInfo = resp.data.list;
            this.total = resp.data.total;
          });
        // 搜索栏学生信息填充
        studentApi.getStuTeacherList().then(resp=>{
          this.student.optionsStu = resp.data.list;
        })
      },
      onSubmit() {
        gradeApi
          .pageList(this.pageSize, this.curPage, this.FormData)
          .then((resp) => {
            this.logInfo = resp.data.list;
            this.total = resp.data.total;
          });
      },
      clear() {
        (this.FormData = {});
        this.FormData.status = 1;
        gradeApi
          .pageList(this.pageSize, this.curPage, this.FormData)
          .then((resp) => {
            this.logInfo = resp.data.list;
            this.total = resp.data.total;
          });
      },
      gradeShow(row) {
        this.row = row;
        console.log(this.row,"row");
        this.dialogVisible = true;
         
      },
    // 关闭评分的创口
    handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
      },

      // 页数发生变化
      handleCurrentChange() {
        gradeApi
            .pageList(this.pageSize, this.curPage, this.FormData)
            .then((resp) => {
              this.logInfo = resp.data.list;
              this.total = resp.data.total;
            });
      },
    },
  };
  </script>
  
  <style></style>
  